<template>
  <view class="other-upload-page p_bg_f3">
    <view class="list">
      <view class="item" data-url="otherUploadDetail?type=qq" @click="skipPage">
        <image class="icon" src="/subpages/static/other-icon-1.png"></image>
        <view class="info">
          <view class="name">QQ</view>
          <view class="sub">打印QQ里面的文件</view>
        </view>
        <view class="arrow"></view>
      </view>
      <view class="item" data-url="otherUploadDetail?type=wps" @click="skipPage">
        <image class="icon" src="/subpages/static/other-icon-2.png"></image>
        <view class="info">
          <view class="name">WPS</view>
          <view class="sub">打印WPS里面的文件</view>
        </view>
        <view class="arrow"></view>
      </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        
      };
    },
    methods: {
      skipPage(e) {
        uni.navigateTo({
          url: e.currentTarget.dataset.url,
        })
      }
    }
  }
</script>

<style lang="scss">
.other-upload-page {
  padding: 14px;
  box-sizing: border-box;
  overflow: hidden;
  min-height: 100vh;
  width: 100vw;
  .list {
    background-color: #fff;
    box-sizing: border-box;
    border-radius: 20rpx;
    padding: 0 24rpx;
    .item {
      border-bottom: 1px solid #ddd;
      padding: 32rpx 0;
      @include flex;
      .icon {
        width: 64rpx;
        height: 64rpx;
        margin: 0 24rpx;
      }
      .info {
        flex: 1;
        line-height: 1.2;
        .name {
          color: #333;
          font-size: 32rpx;
          margin-bottom: 12rpx;
        }
        .sub {
          color: #999;
          font-size: 28rpx;
        }
      }
      &:last-child {
        border-bottom: none;
      }
      .arrow {
        width: 10px;
        height: 10px;
        border-top: 3px solid #ddd;
        border-right: 3px solid #ddd;
        transform: rotate(45deg);
        box-sizing: border-box;
      }
    }
  }
}
</style>
